import axios, { AxiosResponse } from 'axios';
import { useEffect, useState } from 'react';
import useData from '@/hooks/useData';

interface IRes {
  success: boolean;
  data: {
    records: { pointName: string; totalNum: number; id: string }[];
    total: number;
    query: object;
  };
}
export default function Index() {
  const [pageSize, setPageSize] = useState(10);
  const fetchData = (params: any) => {
    return new Promise<IRes>(resolve => {
      axios.get('/getMockList', { params }).then((res: AxiosResponse<IRes>) => {
        setTimeout(() => {
          resolve(res?.data);
        }, Math.random() * 5 * 1000);
      });
    });
  };
  const data = useData<IRes>(fetchData, { pageSize });

  // const [data, setData] = useState({});
  // useEffect(() => {
  //   axios.get('/getMockList', { params: { pageSize } }).then(res => {
  //     setTimeout(() => {
  //       setData(res.data);
  //     }, Math.random() * 3 * 1000);
  //   });
  // }, [pageSize]);
  return (
    <div onClick={() => setPageSize(pageSize + 1)}>
      Index
      {JSON.stringify(data?.data?.query)}
      <br />
    </div>
  );
}
